<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>
<%--
  Created by IntelliJ IDEA.
  User: lxf
  Date: 2016/8/17
  Time: 11:47
  To change this template use File | Settings | File Templates.
--%>
<html>
<head>
    <title>Title</title>
</head>
<body>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<script>
    var width = 600;
    var height = 600;
    var dataset = [30, 10, 43, 55, 13];

    var svg = d3.select("body").append("svg")
            .attr("width", width)
            .attr("height", height);

    var pie = d3.layout.pie();

    var outerRadius = width / 2;
    var innerRadius = width / 4;
    var arc = d3.svg.arc()
            .innerRadius(innerRadius)
            .outerRadius(outerRadius);

    var color = d3.scale.category10();

    var arcs = svg.selectAll("g")
            .data(pie(dataset))
            .enter()
            .append("g")
            .attr("transform", "translate(" + outerRadius + "," + outerRadius + ")");

    arcs.append("path")
            .attr("fill", function (d, i) {
                return color(i);
            })
            .attr("d", function (d) {
                return arc(d);
            });

    arcs.append("text")
            .attr("transform", function (d) {
                return "translate(" + arc.centroid(d) + ")";
            })
            .attr("text-anchor", "middle")
            .text(function (d) {
                return d.value;
            });

    console.log(dataset);
    console.log(pie(dataset));

</script>

</body>
</body>
</html>
